<template>
	<view class="edge-slide-area" @touchstart="onTouchStart" @touchend="onTouchEnd">
		<slot></slot>
	</view>
</template>

<script setup lang="ts">
import { onMounted, onUnmounted, ref } from 'vue';
import Exit from '../../uni_modules/fer-harmony/utssdk/app-harmony/exit';

	
	const exit=new Exit()
	const startX=ref(0)
	function onTouchStart(e:TouchEvent){
		startX.value=e.touches[0].clientX
	}
	function onTouchEnd(e:TouchEvent){
		const endX=e.changedTouches[0].clientX
		const deltaX=endX-startX.value
		// 如果从左边缘开始右滑 或 右边缘左滑，视为退出尝试
			if(startX.value<30 && deltaX>80){
				exit.tryExit()
			}else if(startX.value>uni.getSystemInfoSync().screenWidth-30&&deltaX<-80){
				exit.tryExit()
			}
	}
	function backPressListener(e:any){
		e.prevenDefault()
		exit.tryExit()
	}
	onMounted(()=>{
		// #ifdef APP-HARMONY
		document.addEventListener('backbutton',backPressListener,false)
		// #endif
	})
	onUnmounted(()=>{
		// #ifdef APP-HARMONY
		document.removeEventListener('backbutton',backPressListener,false)
		// #endif
	})
	

</script>

<style>
	.edge-slide-area {
	  position: fixed;
	  width: 100%;
	  height: 100%;
	  z-index: 999;
	}
</style>